import React, { useState, useRef } from 'react';
import { View, TextInput } from 'react-native';


export default function HomeScreen(): React.ReactElement {
  const inpRef = useRef<TextInput>(null)

  const [word, setWord] = useState('')

  return (
    <View
      style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}
      onStartShouldSetResponder={() => true}
      onResponderRelease={() => inpRef.current?.blur()}
    >
      <TextInput
        ref={inpRef}
        placeholder='查单词'
        value={word}
        onChangeText={text => setWord(text)}
        style={{
          minWidth: 200,
          maxWidth: '80%',
          height: 40,
          borderRadius: 4,
          borderColor: '#9090f8',
          borderWidth: 2,
          borderStyle: 'solid',
          paddingHorizontal: 12,
        }}
      />
    </View>
  );
}